<template>
  <div class="footer-info">
    <div class="container">
      <!-- 图标区域 -->
      <div class="logo">
        <div class="logo-img">
          <img src="/imgs/logo-footer.png" alt="" />
        </div>
        <p class="logo-title">二手交易系统商城</p>
      </div>
      <!-- 底部信息区域 -->
      <div class="links">
        <a href="javascript:;">二手交易系统集团隐私政策</a>
        <a href="javascript:;">二手交易系统商城隐私政策</a>
        <a href="javascript:;">二手交易系统商城用户协议</a>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "FooterInfo",
};
</script>
<style scoped>
.footer-info {
  width: 100%;
  height: 272px;
  background-color: #333333;
  border-top: 4px solid #ff7301;
}
.container {
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 272px;
}
.logo {
  margin: 46px 0 31px 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.logo-img {
  width: 53px;
  height: 36px;
}
.logo-img img {
  width: 100%;
}
.logo-title {
  margin-top: 13px;
  color: #999999;
  font-size: 16px;
}

.links a {
  color: #999999;
  font-size: 16px;
  padding: 0 8px;
  border-right: 1px solid #999999;
}
.links a:last-child {
  border: none;
}
.copyright {
  color: #999999;
  font-size: 16px;
  margin-top: 15px;
}
.copyright span {
  color: #ff7301;
}
</style>
